<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>应急预案管理_参考方案_新增参考方案界面</title>
     <script type="text/javascript" src="<%=basePath %>jclient/javascript/jslib/jquery.js" ></script>
	<script type="text/javascript" src="jclient/javascript/modules/yjyagl/yjyagl_ckfa.js"></script>
   <link rel="stylesheet" href="<%=basePath%>jclient/css/public.css" type="text/css" />
    <style type="text/css">
    .span_menu{
       display: inline-block;
       height: 30px;
       line-height: 30px;
       color: #5D94D7;
       padding:5px 10px;
       position:relative;
       top:1px;
       font-weight: bold;
       font-size: large;
       cursor: pointer;
       background-color: #ffffff;
    }
    .fileTmenu{
      display: inline-block;
      margin: 0px;padding: 0px;
      border: 1px solid #285081;
      float: right;
    }
    .hover{
      background-color: #FFC000;
    }
    
    </style>
    <script type="text/javascript">
    var  basePath="<%=basePath%>";
	    $(function(){
	    	$(".ctr").attr("align","center");
	    	$("#ltab tr td img").attr("height","20px");
	   		 $(".span_menu").css("border","1px solid #FFFFFF");
	         $(".span_menu").eq(0).css("border-top","1px solid #5183BE");
	         $(".span_menu").eq(0).css("border-right","1px solid #5183BE");
   	         $(".span_menu").eq(1).css("border-bottom","1px solid #5183BE");
	         $(".span_menu").eq(2).css("border-bottom","1px solid #5183BE");
	         $(".fileTmenu").hover(
				  function () {
				    $(this).addClass("hover");
				  },
				  function () {
				    $(this).removeClass("hover");
				  }
			  );
			  $("#centerTab tr td").each(function(){
			     if($(this).attr("align")==undefined)
			     $(this).css("text-align","center");
			  });
			  $("#centerTab tr td").css("padding","3px");
	    });
	    function dealspan_menu(clickObj){
	    		$(".span_menu").css("border","1px solid #FFFFFF");
	    		$(".span_menu").css("top","1px");
	            $(".span_menu").each(function (i){
	                if(this==clickObj){
	                  switch(i){
	                     case 0:
                                  $(".span_menu").eq(0).css("border-top","1px solid #5183BE");
	        					  $(".span_menu").eq(0).css("border-right","1px solid #5183BE");
					   	          $(".span_menu").eq(1).css("border-bottom","1px solid #5183BE");
						          $(".span_menu").eq(2).css("border-bottom","1px solid #5183BE");
	                   			  break;
              			 case 1:
              			        
              				      $(".span_menu").eq(0).css("border-bottom","1px solid #5183BE");
              			          $(".span_menu").eq(1).css("border-left","1px solid #5183BE");
              			          $(".span_menu").eq(1).css("border-top","1px solid #5183BE");
              			          $(".span_menu").eq(1).css("border-right","1px solid #5183BE");
						       	  $(".span_menu").eq(2).css("border-bottom","1px solid #5183BE");
	                   			  break;
	                   	 case 2:
	                   	          $(".span_menu").eq(0).css("border-bottom","1px solid #5183BE");
	                   	  		  $(".span_menu").eq(1).css("border-bottom","1px solid #5183BE");
	                   	          $(".span_menu").eq(2).css("border-top","1px solid #5183BE");
							      $(".span_menu").eq(2).css("border-right","1px solid #5183BE");
							      $(".span_menu").eq(2).css("border-left","1px solid #5183BE");
	                   			  break;
	                   	
	                  }
	                }
	            });
	    }
    </script>
  </head>
  
  <body style="padding: 0px;margin: 0px;padding-top: 20px;">
    <table>
    	<tr>
    		<tr>
    		<td scope="row" style="padding-left: 20px;" valign="top">
    			<div style="border-bottom: 1px solid #5183BE;width: 500px;">
    			   <span class="span_menu" onclick="dealspan_menu(this);"  >事件信息 </span>
   			       <span class="span_menu" onclick="dealspan_menu(this);" >参考方案 </span>
   			       <span class="span_menu" onclick="dealspan_menu(this);">类似事件 </span>
    			</div>
    			<br>
    			<ul style="height: 30px;width: 550px;margin-bottom: 5px;"> 
    			   <li style="width: 20px;float: right;">&nbsp;&nbsp;&nbsp;</li>
    			   <li class="eclipseBtn fileTmenu" >音频资料</li>
    			   <li class="eclipseBtn fileTmenu" >视频资料</li>
    			   <li class="eclipseBtn fileTmenu" >图片资料</li>
    			   <li class="eclipseBtn fileTmenu" >表格资料</li>
    			   <li class="eclipseBtn fileTmenu" >文档资料</li>
    			</ul>
    			
    				<!-- list -->
    				   <div style="border: 1px solid #eeeeee;padding: 5px;width: 650px;">
	    			<div style="margin: 0px;padding: 0px;width: 630px;text-align: left;margin-right: 5px;margin-bottom: 5px;">
	    			 				<span class="eclipseBtn" style="display: inline-block;" >清除</span>
									<span class="eclipseBtn" style="display: inline-block;">批量下载</span>
	    			 				<span class="eclipseBtn" style="display: inline-block;">添加新文件</span>
	    			 
	    			</div>
	    			<table id="ltab" border=1px cellpadding="0" cellspacing="0" width="630px" height="300px" style="margin-right: 5px;">
							<tr class="ctr">
								<td width="50px" >
									<input type="checkbox">
								</td>
								<td width="380px">名称</td>
								<td width="100px">
									制定时间
								</td>
								<td width="100px">
									下载
								</td>
							</tr>
							<tr class="ctr">
								<td width="50px">
									<input type="checkbox" >1
								</td>
								<td width="380px" style="width: 380px;">
									<a href="###">2012年3月桥水蓝藻暴发事件</a>
								</td>
								<td>
									2012年3月
								</td>
								<td>
									<a href="##"><img src="<%=basePath%>jclient/images/tjimages/xz.png"></a>
								</td>
							</tr>
							<tr class="ctr">
								<td >
									<input type="checkbox">2
								</td>
								<td >
									<a href="###">2012年3月桥水蓝藻暴发事件</a>
								</td>
								<td>
									2012年3月
								</td>
								<td>
									<a href="##"><img src="<%=basePath%>jclient/images/tjimages/xz.png"></a>
								</td>
							</tr>
							<tr class="ctr">
								<td >
									<input type="checkbox">3
								</td>
								<td >
									<a href="###">2012年3月桥水蓝藻暴发事件</a>
								</td>
								<td>
									2012年3月
								</td>
								<td>
									<a href="##"><img src="<%=basePath%>jclient/images/tjimages/xz.png"></a>
								</td>
							</tr>
							<tr class="ctr">
								<td >
									<input type="checkbox">4
								</td>
								<td >
									<a href="###">2012年3月桥水蓝藻暴发事件</a>
								</td>
								<td>
									2012年3月
								</td>
								<td>
									<a href="##"><img src="<%=basePath%>jclient/images/tjimages/xz.png"></a>
								</td>
							</tr>
							<tr class="ctr">
								<td >
									<input type="checkbox">5
								</td>
								<td >
									<a href="###">2012年3月桥水蓝藻暴发事件</a>
								</td>
								<td>
									2012年3月
								</td>
								<td>
									<a href="##"><img src="<%=basePath%>jclient/images/tjimages/xz.png"></a>
								</td>
							</tr>
							<tr>
								<td align="right" colspan="4">
									共3条 
									<a>1</a>
									<a>2</a>
									<a>3</a>
								</td>
							</tr>
						</table>
					<!-- 列表 -->
				</div>
    				<!-- list -->
    		</td>
    		<td  valign="top">
				    <form name="myform" action="yjyagl_ckfa_f.jsp" >
				    	<table id="centerTab" border="1" cellpadding="0" cellspacing="0" width="567" height="334"> 
				    		<tr>
				    			<td width="150px">
				    				记录时间
				    			</td>
				    			<td>
				    				<input type="text" name="writeTime"/>
				    			</td>
				    		</tr>
				    		<tr>
				    			<td>
				    				记录人
				    			</td>
				    			<td>
				    				<input type="text">
				    			</td>
				    			</tr>
				    			<tr>
				    					<td>
				    						事件时间
				    					</td>
				    					<td>
				    						<input type="text" name="evenTime"/>
				    					</td>
				    				</tr>
				    				<tr>
				    					<td>
				    						事件地点
				    					</td>
				    					<td>
				    						<input  type="text" name="site"/>
				    					</td>
				    				</tr>
				    				<tr>
				    					<td>
				    						影响供水程度
				    					</td>
				    					<td>
				    						<input type="text" name="impact"/> 
				    					</td>
				    				</tr>
				    				<tr>
				    					<td>
				    						事件概述
				    					</td>
				    					<td>
				    						<textarea rows="4" cols="40" ></textarea>
				    					</td>
				    				</tr>
				    				<tr>
				    					<td>
				    						先期处理
				    					</td>
				    					<td>
				    						<input type="text" name=" dispose">
				    					</td>
				    				</tr>
				    				    				<tr>
				    					<td rowspan="4">
				    						评价结果
				    					</td>
				    					<td align="left">
				    						事件分析：<input type="text" name="analyze"/>
				    					</td>
				    				</tr>
				    				<tr>
				    					<td align="left">
				    						事件分级：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
				    						<select style="width: 60px">
				    							<option>Ⅰ</option>
				    							<option>Ⅱ</option>
				    							<option>Ⅲ</option>
				    						</select>
				    						<a href="javascript:standard();">分级标准</a>
				    						<textarea id="standard" rows="4" cols="30" readonly="readonly" style="display:none">
				    						</textarea>
				    					</td>
				    				</tr>
				    				<tr>
				    					<td align="left">
				    						报警级别：
				    						<select style="width: 60px">
				    							<option>Ⅰ</option>
				    							<option>Ⅱ</option>
				    							<option>Ⅲ</option>
				    						</select>
				    					</td>
				    				</tr>
				    				<tr>
				    					<td align="left">
				    						响应级别：
				    						<select style="width: 60px">
				    							<option>Ⅰ</option>
				    							<option>Ⅱ</option>
				    							<option>Ⅲ</option>
				    						</select>
				    					</td>
				    				</tr>
				    				<tr>
				    					<td>
				    						事件等级
				    						
				    					</td>
				    					<td>
				    						<select style="width: 60px">
				    							<option>Ⅰ</option>
				    							<option>Ⅱ</option>
				    							<option>Ⅲ</option>
				    						</select>
				    					</td>
				    				</tr>
				    				<tr>
				    					<td>
				    						执行预案
				    					</td>
				    					<td>
				    						<select>
				    							<option>
				    								预案1
				    							</option>
				    						</select>
				    						<a href="javascript:#">选择</a>
				    					</td>
				    				</tr>
				    				<tr>
				    					<td>
				    						应急队伍
				    					</td>
				    					<td align="right">
				    					 	<span  class="eclipseBtn" style="display: inline-block;" >上传</span>
				    					</td>
				    				</tr>
				    				<tr>
				    					<td colspan="2" align="center">
				    						<span  class="eclipseBtn" style="margin: 10px;display: inline-block;" onclick="srmc();">确认</span>
				    					</td>
				    				</tr>
				    			</table>
				    </form>
    		</td>
    	</tr>
    </table>
  </body>
</html>
